import React, {Component} from 'react';
import { Link } from "react-router-dom";
import Search from "../../component/Search";
import Table from "../../component/Table";
import Confirm from "../../component/Confirm";
import {formatTime} from "@/utils";

class Index extends Component {

    state = {
        searchConfig: {
            columns: [
                {
                    type: 'Input',
                    name: 'schoolName',
                    placeholder: '学校名称',
                },
                {
                    type: 'Input',
                    name: 'className',
                    placeholder: '班级名称',
                },
                {
                    type: 'Input',
                    name: 'professional',
                    placeholder: '专业',
                },
                {
                    type: 'Select',
                    name: 'teachingType',
                    placeholder: '专业层次',
                    options: [
                        {value: '专科教学', text: '专科教学'},
                        {value: '本科教学', text: '本科教学'},
                        {value: '硕士教学', text: '硕士教学'},
                        {value: '博士教学', text: '博士教学'},
                        {value: '其他', text: '其他'},
                    ]
                },
                {
                    type: 'Input',
                    name: 'teacherName',
                    placeholder: '带队教师',
                },
                {
                    type: 'Input',
                    name: 'telephone',
                    placeholder: '联系方式',
                },
                {
                    type: 'RangePicker',
                    name: 'trainingTime',
                    range: ['startTime', 'endTime'],
                    placeholder: ["初始实训时间","结束实训时间"]
                }
            ]
        },
        tableConfig: {
            columns: [
                {
                    title: '#',
                    width: 60,
                    fixed: 'left',
                    render: (text, record, index) => {
                        const {current,pageSize} = this.state.tableConfig.pagination;
                        return (current-1) * pageSize + (index+1)
                    }
                },
                {
                    title: '班级名称',
                    ellipsis: true,
                    render: (text) => <Link to={"/user/user_mg/class/"+text.id + '/'+text.classCode}>{text.className}</Link>,
                    width: 120
                },
                {
                    title: '学校名称',
                    dataIndex: 'schoolName',
                    width: 110
                },
                {
                    title: '专业',
                    dataIndex: 'professional',
                    width: 90
                },
                {
                    title: '专业层次',
                    dataIndex: 'teachingType',
                    width: 90
                },
                {
                    title: '学生人数',
                    dataIndex: 'studentNum',
                    width: 100
                },
                {
                    title: '带队教师',
                    dataIndex: 'teacherName',
                    width: 100
                },
                {
                    title: '联系方式',
                    dataIndex: 'telephone',
                    width: 110
                },
                {
                    title: '实训时间',
                    render: (text) => `${formatTime(text.startTime) + ' - ' + formatTime(text.endTime)}`,
                    width: 180
                },
                {
                    title: '实训课程',
                    dataIndex: 'curriculumCount',
                    width: 100
                },
                {
                    title: '实训项目',
                    dataIndex: 'projectCount',
                    width: 100
                },
                {
                    title: '添加人',
                    dataIndex: 'createName',
                    width: 80
                },
                {
                    title: '添加时间',
                    render: (text) => `${formatTime(text.createTime, 16)}`,
                    width: 130
                },
                {
                    title: '操作',
                    fixed: 'right',
                    width: 80,
                    render: (text) => {
                        if(!text.studentNum){
                            return <Confirm research={this.search}
                                            url={'/Class/deleteClazz?id='+text.id}
                            ><span className="delete">删除</span></Confirm>
                        }
                        return null
                    }
                }
            ],
            pagination: {
                current: 1,
                pageSize: 15
            },
            params: {
                paramsMap: {},
                sortName: "create_time",
                sortType: "desc",
            },
            request: {
                method: 'post',
                url: '/Class/getClassPage'
            }
        }
    };

    render() {
        return (
            <div className="table-list">
                <Search config={this.state.searchConfig} search={this.search} />
                <Table config={this.state.tableConfig} onRef={(ref) => this.table = ref } />
            </div>
        )
    }

    // 回调
    search = (searchConfig) => {
        const { tableConfig } = this.state;
        this.setState({
            tableConfig: {
                ...tableConfig,
                pagination: {
                    current: 1,
                    pageSize: 15
                }
            }
        }, () => {
            const { params, pagination } = this.state.tableConfig;
            this.table.getTableList({...params, paramsMap: {...searchConfig}}, pagination)
        })
    }
}

export default Index